import React from 'react';
import { inject, observer } from 'mobx-react';
import { TableProps } from 'antd/es/table';
import { IStore } from '../../types';
import { Table as Table_ } from '../pc/antd/data_show';

interface ITableProps extends TableProps<any>, IStore {
  currentKey?: string;
  total?: number;
}

/**
 * 全局表格
 * 统一分页数据
 */
@inject('store')
@observer
export class Table extends React.Component<ITableProps> {
  render() {
    const { store, currentKey = 'currentTable', total = 0, pagination, onChange, ...props } = this.props;
    const { keys, setKey } = store!.view;
    return (
      <Table_
        pagination={{
          current: keys[currentKey] || 1,
          pageSize: keys.pageSize,
          showSizeChanger: true,
          onShowSizeChange: (_current, pageSize) => setKey('pageSize', pageSize),
          total,
          ...pagination,
        }}
        onChange={(pagination: any, filters: any, sorter: any, extra: any) => {
          setKey(currentKey, pagination.current);
          onChange && onChange(pagination, filters, sorter, extra);
        }}
        {...props}
      />
    );
  }
}